<!DOCTYPE html>
<html lang="zh-CN">
    <head>
        <meta charset="UTF-8" />
        <title>08_innerText和textContent的区别</title>
    </head>
    <body>
        <p style="visibility: hidden;" id="p1">今天中午大家吃什么？</p>

        <p id="p2">不知道吃什么</p>


        <script>
            // var p = document.querySelector('#p1');

            // （1）textContent可以获取到隐藏元素的内容
            //      innerText获取不到隐藏元素的内容的
           
            // console.log(p.innerText);
            // console.log('-----------------');
            // console.log(p.textContent);

             // （2）浏览器分为高级浏览器和低级浏览器
            // 区分标准为IE8及其IE8以下的浏览器都为低级浏览器  其余的为高级浏览器
            // innerText可以在高级和低级浏览器中使用
            // textContent只可以在高级浏览器中使用  如果在低级浏览器中使用
            // 则会返回undefined
            var p2 = document.querySelector('#p2');
            console.log(p2.innerText);
            console.log('---------------');
            console.log(p2.textContent);

        </script>
    </body>
</html>